<template>
	<view>
		<!--  hotList Array [] 热门搜索数据
		blurList Array [] 模糊搜索内容
		placeholder String '请输入' 输入框placeholder
		storageKey String 'liu-search-name-list' 搜索历史缓存key值(多个页面使用时需要传)
		@change Function 搜索回调事件
		@input Function 搜索框input回调事件 -->
		<view class="search-box">
			<liu-search :hotList="hotList" @input="input" @change="change"></liu-search>
		</view>


	</view>
</template>

<script>
	export default {
		data() {
			return {
				hotList: ['白酒', '苹果醋', '红酒', '笔记本', '洗衣液', '平板电脑', '电视机'], //热门搜索
				blurList: ['我的', '我要红包', '我要开红包', '我的红包', '我的世界'], //模糊搜索内容
			}
		},
		methods: {
			//搜索回调
			change(e) {
				console.log('搜索回调信息：' + e)
						this.gotoGoodsList(e)
			},
			//input事件
			input(e) {
				console.log('搜索框输入的内容：' + e)
				
			},


			async gotoGoodsList(e) {
				console.log("跳转到商品页面:", e);
				uni.navigateTo({
					url: `/subpkg/good_list/good_list?query=${e}`
				});
			}

		}
	}
</script>

<style lang="less">
	.search-box {
		position: sticky;
		top: 0;
		z-index: 999;
	}
</style>